<template>
  <div class="pay-info">
    <div class="tip" v-if="payInfo.length != 0">
      <p>请打款至：</p>
      <div v-if="type == '1'">
        <p>支付宝账号：{{payInfo[0].accountNumber}}</p>
        <p>支付宝账号实名：{{payInfo[0].name}}</p>
      </div>
      <div v-if="type == '2'">
        <p>银行开户行：{{payInfo[0].bankName}}</p>
        <p>银行卡账号：{{payInfo[0].accountNumber}}</p>
        <p>银行卡账号实名：{{payInfo[0].name}}</p>
      </div>
      <p>如有问题可联系微信客服：{{payInfo[0].customerService}}</p>
    </div>
  </div>
</template>

<script>
import http from "../service/myHttp.js";
import urls from "../service/url.js";
import { mapState } from "vuex";

export default {
  props: {
    type: {
      type: [String, Number],
      default: "1" // 1:支付宝  2:银行卡
    }
  },
  data() {
    return {
      payInfo: []
    };
  },
  computed: {
    ...mapState({
      userinfo: state => state.login_module.userinfo,
      countAlias: "userinfo"
    })
  },
  watch: {
    type(){
      this.getPayInfo()
    }
  },
  mounted() {
    this.getPayInfo()
  },
  methods: {
    getPayInfo() {
      http
        .post(urls.HQDKZH, {
          type: this.type
        })
        .then(res => {
          console.log(res);
          if (res.data.code == 200) {
            this.payInfo = res.data.data;
          }
        });
    }
  }
};
</script>

<style scoped>
.tip {
  padding: 10px 15px;
  background-color: #fff;
}

.tip p {
  margin-bottom: 5px;
}
</style>